<template>
	<view class="">
		<view class="header-con column center" :style="{background: bgColor}">
			<view class="header row" :style="{background: inputColor}" @tap="navTo('/pages/search/index')">
				<view class="back_div"><u-icon name="search" :color="iconColor"></u-icon></view>
				<input class="input" :style="{color: iconColor}" disabled placeholder="请输入关键词" :placeholder-class="placeholder" />
			</view>
		</view>
	</view>
</template>

<script>

export default {
	props:{
		bgColor:{
			type:String,
			default:"#ffffff"
		},
		inputColor:{
			type:String,
			default:"#ffffff"
		},
		iconColor:{
			type:String,
			default:"#999999"
		},
		placeholder:{
			type:String,
			default:"placeholdera"
		}

	},
	data(){
		return{

		}
	}
}
</script>

<style scoped>
/deep/ .placeholdera {
	color: #999999;
}
/deep/ .placeholderw {
	color: #666666 !important;
}
.header-con {
	width: 100%;
	height: 86upx;
	padding: 0 33upx;
}
.header {
	width: 706upx;
	height: 66upx;
	border-radius: 33upx;
}

.back_div {
	width: 65upx;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.back_img {
	width: 35upx;
	height: 35upx;
}

.input {
	font-size: 28upx;
	width: 620upx;
	height: 66upx;
	border-radius: 40upx;
	box-sizing: border-box;
	text-align: left;
}
</style>
